<template>
  <div class="wrapper">
    <el-table ref="multipleTable" :data="tableData3" tooltip-effect="dark" height="260" style="width: 100%;margin:10px 0">
      <!--<el-table-column label="名称" type="index" :index="indexMethod" align="center" width="80"></el-table-column>-->
      <el-table-column label="名称" prop="Name" align="center"></el-table-column>
      <el-table-column label="电压" prop="U" align="center">
        <template slot-scope="scope">
          <template v-if="scope.row.U==null">
            --
          </template>
          <template v-else>
            {{scope.row.U}}
          </template>
        </template>

      </el-table-column>
      <el-table-column label="电流" prop="I" align="center">
        <template slot-scope="scope">
          <template v-if="scope.row.I==null">
            --
          </template>
          <template v-else>
            {{scope.row.I}}
          </template>
        </template>

      </el-table-column>
      <el-table-column label="功率" prop="P" align="center">
        <template slot-scope="scope">
          <template v-if="scope.row.P==null">
            --
          </template>
          <template v-else>
            {{scope.row.P}}
          </template>
        </template>
      </el-table-column>
      <el-table-column label="功率因数" prop="Cos" align="center">
        <template slot-scope="scope">
          <template v-if="scope.row.Cos==null">
            --
          </template>
          <template v-else>
            {{scope.row.Cos}}
          </template>
        </template>
      </el-table-column>
    </el-table>
    <div class="d-flex align-items-center justify-content-center">
      <el-button slot="append" class="ur-btn ur-btn-primary"  @click="LightRealTimeDetail" :disabled="btnState"><i class="iconfont icon-sousuo"></i>实时查询</el-button>
      <el-button class="ur-btn ur-btn-primary w120 ml-2" @click="showLightOnOff=true" :disabled="btnState"><i class="iconfont icon-dankong"></i>开关灯调光</el-button>
    </div>

    <!--单灯开关调光-->
  <!--  <el-dialog v-el-drag-dialog title="单灯控制" :visible.sync="showLightOnOff"  append-to-body width="516px" top="15%" @close="showLightOnOff=false">
      <template v-if="showLightOnOff">
        <light-ctrl :lightType="pole.ChannelMode==1?'rtu':'nb'"  :page="'gis'" :poles="[pole]"></light-ctrl>
      </template>
    </el-dialog>-->
  </div>
</template>

<script>
  import api from 'api/api'
  import elDragDialog from 'directive/el-dragDialog'
  // import lightCtrl from '../hand-controller/light-controller'
  import {mapState} from 'vuex'

  export default {
    directives:{elDragDialog},
    components: {},
    props: {
      pole: {}
    },
    data() {
      return {
        tableData3:[],
        Name: ['', '火1：', '火2：', '火3：', '火4：'],
        showLightOnOff:false
      }
    },
    watch: {},
    computed: {
      ...mapState({
        btnState: state => state.user.btnState
      })
    },
    methods: {
      indexMethod(index) {
        return this.Name[index + 1]
      },
      QueryLightDetail() {
        let self = this;
        this.tableData3 = [];
        api.fetchSimple('/Monitor/QueryLightDetailById', {tnId: this.pole.TnId})
          .then(r => {
            let res = r.data
            for (let i = 1; i <= res.Lamps; i++) {
              this.tableData3.push({Name:'火'+i,State: res['State' + i], I: res['I' + i], U: res['U' + i], P: res['P' + i], Cos: res['Cos' + i]})
            }
          })
      },
      LightRealTimeDetail() {
        if(this.pole.ChannelMode==2||this.pole.ChannelMode==3){//NB
          this.$store.commit('user/SET_USER_PWD', '')
          this.$store.commit('user/SET_BTN_STATE',true)
          api.fetchSimple('/Communication/NB/NBRealTimeDetail', { tnDevAddr: this.pole.PoleDevAddr }).then(r => {
            this.$store.commit('user/SET_BTN_STATE',false)
            if(r!=''){
              this.$message.success({showClose:true,message:'召测成功'})
              let res=r.data
              this.tableData3=[]
              for(let i=1;i<=res.Lamps;i++){
                this.tableData3.push({Name:'火'+i,State:res['State'+i],I:res['I'+i],U:res['U'+i],P:res['P'+i],Cos:res['Cos'+i]})
              }
            }
          })
        }else{
          this.$message.info({showClose:true,message:'暂不支持'})
        }
      }

    },
    created() {
      this.QueryLightDetail()
    },
    mounted() {
    }
  }
</script>
<style scoped lang="stylus" rel="stylesheet/stylus">
</style>
